<div class="main-content">

    <div class="header bg-white a-shadow-light-s sticky-top">

        <div class="row mx-0">

            <ul class="col-12 col-xl-8 nav nav-tabs  mt-2 px-4">
                <li class="nav-item">
                    <a class="py-3 nav-link [if[::constants.Params.status=needpay::active]if]" href="#" onclick="Aps.query.addFilter('status','needpay')">
                        <span class="text-md">{i18n{ needpay }i18n}</span>
                    </a>
                </li>
                <li class="nav-item">
                    <a class="py-3 nav-link [if[::constants.Params.status=pending::active]if]" href="#" onclick="Aps.query.addFilter('status','pending')">
                        <span class="text-md">{i18n{ pending }i18n}</span>
                    </a>
                </li>
                <li class="nav-item">
                    <a class="py-3 nav-link [if[::constants.Params.status=shipping::active]if]" href="#" onclick="Aps.query.addFilter('status','shipping')">
                        <span class="text-md">{i18n{ shipping }i18n}</span>
                    </a>
                </li>
                <li class="nav-item">
                    <a class="py-3 nav-link [if[::constants.Params.status=done::active]if]" href="#" onclick="Aps.query.addFilter('status','done')">
                        <span class="text-md">{i18n{ done }i18n}</span>
                    </a>
                </li>
                <li class="nav-item">
                    <a class="py-3 nav-link [if[::constants.Params.status=expired::active]if]" href="#" onclick="Aps.query.addFilter('status','expired')">
                        <span class="text-md">{i18n{ expired }i18n}</span>
                    </a>
                </li>
                <li class="nav-item">
                    <a class="py-3 nav-link [not[::constants.Params.status::active]not]" href="#" onclick="Aps.query.removeFilter('status')">
                        <span class="text-md">{i18n{ status.all }i18n}</span>
                    </a>
                </li>
            </ul>

            <div class="col-12 col-xl-4 nav-tabs">

<!--                <div class="row my-2">-->

<!--                    <form class="col ml-3" id="search" action="?search">-->
<!--                        <div class="input-group input-group-flush">-->
<!--                            <div class="input-group-prepend">-->
<!--                                <span class="input-group-text"><i class="fe fe-search"></i></span>-->
<!--                            </div>-->
<!--                            <input class="form-control search" type="search" placeholder="{i18n{ enterKeyword }i18n}" name="keyword" value="{{constants.Params.keyword}}" required>-->
<!--                        </div>-->

<!--                    </form>-->

<!--                    <button class="btn btn-sm btn-primary mr-3" type="submit" form="search">-->
<!--                        {i18n{ Search }i18n}-->
<!--                    </button>-->

<!--                    <button class="btn btn-sm btn-white mr-3" type="button" onclick="Aps.query.clearFilter();">-->
<!--                        {i18n{ Reset }i18n}-->
<!--                    </button>-->


<!--                </div>-->

            </div>


        </div>


        <div class="row mx-3 py-2">
            <div class="col-auto">
                <div class="dropdown my-2">
                    <button class="btn btn-sm dropdown-toggle [not[::constants.Params.payment::btn-white]not] [if[::constants.Params.payment::btn-secondary]if]" type="button" id="dropdownMenuButtonCategory" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        {{constants.Params.payment}} {i18n{ payment }i18n}
                    </button>
                    <div class="dropdown-menu" aria-labelledby="dropdownMenuButtonCategory" style="">
                        <a class="dropdown-item" href="" onclick="Aps.query.removeFilter('payment');" >{i18n{ status.all }i18n}</a>
                        <a class="dropdown-item" href="" onclick="Aps.query.addFilter('payment','credit');" >银行卡支付</a>
                        <a class="dropdown-item" href="" onclick="Aps.query.addFilter('payment','Paypal');" >Paypal</a>
                    </div>
                </div>
            </div>

            <div class="col-auto">
                <div class="dropdown my-2">

                    <button class="btn btn-sm dropdown-toggle [not[::constants.Params.sort::btn-white]not] [if[::constants.Params.sort::btn-secondary]if]" type="button" id="dropdownMenuButtonViewtimes" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        {i18n{ manager.sort }i18n}
                    </button>

                    <div class="dropdown-menu" aria-labelledby="dropdownMenuButtonViewtimes" style="">
                        <a class="dropdown-item" onclick="Aps.query.removeFilter('order');" >{i18n{ status.default }i18n}</a>
                        <a class="dropdown-item" onclick="Aps.query.addFilter('order','amount DESC');" > 按金额 从高到低<i class="fe fe-arrow-down"></i></a>
                        <a class="dropdown-item" onclick="Aps.query.addFilter('order','quantity DESC');" >按数量 从高到低<i class="fe fe-arrow-down"></i></a>
                        <a class="dropdown-item" onclick="Aps.query.addFilter('order','createtime DESC');" >按时间 最近<i class="fe fe-arrow-up"></i></a>
                    </div>
                </div>
            </div>

            <div class="col-auto">
                <div class="dropdown my-2">
                    <button class="btn btn-sm btn-white dropdown-toggle" type="button" id="dropdownMenuButtonSize" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        <span class="fe fe-list mr-1"></span> {i18n{ manager.sizePerPage }i18n} [not[::constants.Params.size::10]not]{{constants.Params.size}}
                    </button>
                    <div class="dropdown-menu" aria-labelledby="dropdownMenuButtonSize" style="">
                        <a class="dropdown-item" href="" onclick="Aps.query.removeFilter('size');">{i18n{default}i18n}</a>

                        <a class="dropdown-item" href="" onclick="Aps.query.addFilter('size','8');">8</a>

                        <a class="dropdown-item" href="" onclick="Aps.query.addFilter('size','12');">12</a>

                        <a class="dropdown-item" href="" onclick="Aps.query.addFilter('size','24');">24</a>

                        <a class="dropdown-item" href="" onclick="Aps.query.addFilter('size','48');">48</a>

                        <a class="dropdown-item" href="" onclick="Aps.query.addFilter('size','120');">120</a>

                    </div>
                </div>
            </div>

        </div>


    </div>




    <div class="container-fluid">
        <div class="row justify-content-center">
            <div class="col-12">

                <div class="card">

                    <div class="tab-content">

                        <div class="tab-pane table-responsive active mb-0">
                            <table class="table table-sm card-table" >
                                <thead>
                                <tr>
                                    <th>订单号</th>
                                    <th>订单总额</th>
                                    <th>数量</th>
                                    <th>支付</th>
                                    <th>优惠券</th>
                                    <th>物流单号</th>
                                    <th>用户</th>
                                    <th>{i18n{ manager.createtime }i18n}</th>
                                    <th>{i18n{ manager.status }i18n}</th>
                                    <th>{i18n{ manager.operation }i18n}</th>
                                    <th>{i18n{ manager.more }i18n}</th>
                                </tr>
                                </thead>
                                <tbody class="list">
                                [not[::productList::
                                <tr>
                                    <td colspan="10">
                                        <div class="row justify-content-center">
                                            <div class="col-12 col-md-8 col-xl-6 py-5">

                                                <h2>
                                                    {i18n{SYS_NON}i18n}
                                                </h2>

                                                <a class="btn btn-primary lift" onclick="Aps.router.back(-1)">
                                                    {i18n{ back }i18n}
                                                </a>

                                            </div>
                                        </div>
                                    </td>
                                </tr>
                                ]not]

                                ||loop??productList??
                                <tr class="col-6 col-md-4 col-lg-12">
                                    <td class="p-2">
                                        {{orderid}}
                                    </td>
                                    <td class="p-2 a-text-l">${{amount}}</td>
                                    <td class="p-2">{{quantity}}</td>
                                    <td class="p-2"><a href="/manager/payment/list?paymentid={{paymentid}}"> {{paymentid}}</a></td>
                                    <td class="p-2">{{couponid}}</td>
                                    <td class="p-2">{{trackid}}</td>
                                    <td class="p-2 goal-size">
                                        [if[::userid::
                                        <a href="/{{constants.RootPath}}/user/detail/{{userid}}">
                                                <a class="avatar avatar-xs">
                                                    <img src="{{user.avatar}}" alt="..." class="avatar-img rounded-circle">
                                                </a>
                                            {{user.nickname}}
                                        </a>]if]
                                    </td>
                                    <td class="p-2">{{CREATETIME}}</td>
                                    <td class="p-2 [if[::status=trash::text-muted]if]">{{status_}}</td>
                                    <td class="p-2">
                                        <a href="detail/{{orderid}}" class="btn btn-sm rounded btn-outline-secondary"><span class="fe fe-list"></span> 详情</a>
                                        [if[::status=pending::<a href="detail/{{orderid}}" class="btn btn-sm rounded btn-outline-primary"><span class="fe fe-shopping-cart"></span> 发货</a>]if]
                                    </td>
                                    <td class="p-2 text-right">
                                        <div class="dropdown">
                                            <a href="#" class="dropdown-ellipses dropdown-toggle" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                <i class="fe fe-more-vertical"></i>
                                            </a>
                                            <div class="dropdown-menu dropdown-menu-right">

                                                [if[::status=enabled::
                                                <a class="dropdown-item" onclick="MANAGER.trash('{{productid}}','CommerceProduct');"><span class="fe fe-trash-2 mr-2 text-warning"></span>{i18n{ manager.trash }i18n}</a>
                                                <a class="dropdown-item" onclick="MANAGER.preRemove('{{productid}}','CommerceProduct');"><span class="fe fe-delete mr-2 text-danger"></span>{i18n{ manager.delete }i18n}</a>
                                                ]if]

                                                [if[::status^trash,offline::
                                                <a class="dropdown-item" onclick="MANAGER.recover('{{productid}}','CommerceProduct');"><span class="fe fe-check-circle mr-2 text-success"></span>{i18n{ manager.accept }i18n}</a>
                                                <a class="dropdown-item" onclick="MANAGER.remove('{{productid}}','CommerceProduct');"><span class="fe fe-delete mr-2 text-danger"></span>{i18n{ manager.delete }i18n}</a>
                                                ]if]
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                                loop||
                                </tbody>
                            </table>
                        </div>

                    </div>

                </div>

                <nav aria-label="Page navigation example">
                    <ul class="pagination">

                        [if[::pager.first::
                        <li class="page-item"><a class="page-link" href="#" onclick="Aps.query.addFilter('page','1')">{i18n{ firstPage }i18n}</a></li>
                        ]if]

                        [if[::pager.prev::
                        <li class="page-item"><a class="page-link" href="#" onclick="Aps.query.addFilter('page','{{pager.prev}}')">{i18n{ prevPage }i18n}</a></li>
                        ]if]

                        ||loop??pager.list??
                        [if[::current:: <li class="page-item active"><a class="page-link" href="#" >{{page}}</a></li> ]if]
                        [not[::current::<li class="page-item"><a class="page-link" href="#" onclick="Aps.query.addFilter('page','{{page}}')">{{page}}</a></li> ]not]
                        loop||

                        [if[::pager.next::
                        <li class="page-item"><a class="page-link" href="#" onclick="Aps.query.addFilter('page','{{pager.next}}')">{i18n{ nextPage }i18n}</a></li>
                        ]if]

                        [if[::pager.last::
                        <li class="page-item"><a class="page-link" href="#" onclick="Aps.query.addFilter('page','{{pager.last}}')">{i18n{ lastPage }i18n} ({{pager.last}})</a></li>
                        ]if]

                    </ul>
                </nav>


            </div>
        </div> <!-- / .row -->
    </div>
</div>